<template>
  <!--练习统计-->
  <view class="practiceStatistics flex flex-column">
    <view class="table f_1 flex flex-column">
      <Table :table-data="tableData" @rowClick="rowClick" @scrolltolower="scrolltolower" class="f_1"></Table>
    </view>
  </view>
</template>

<script>
import { pageUpgPracticeDate, pageJsPracticeCountLevel } from "@/improve/services";
import Table from "@/improve/components/Table/Table.vue";
export default {
  name: "practiceStatistics",
  components: { Table },
  data() {
    return {
      upgPracticeUuid: "",
      practiceType: '1',
      dailyTableData: {
        statisticsTitle: "",
        title: ["编号", "练测日期", "练习人数"],
        list: [],
        props: [
          {
            key: 'index',
            width: '20%',
          },
          {
            key: 'date',
            width: '55%',
          },
          {
            key: 'num',
            width: '25%',
          }
        ]
      },
      rivalryTableData: {
        statisticsTitle: "",
        title: ["编号", "关卡名称", "闯关人数"],
        list: [],
        props: [
          {
            key: 'index',
            width: '20%',
          },
          {
            key: 'levelName',
            width: '55%',
          },
          {
            key: 'studentNum',
            width: '25%',
          }
        ]
      },
      pageNo: 1,
      pageTotal: 0
    }
  },
  computed: {
    tableData() {
      return this.practiceType == '3' ? this.rivalryTableData : this.dailyTableData
    }
  },
  methods: {
    rowClick(item) {
      uni.navigateTo({
        url: `/improve/publish/scoreStatistics/practiceUser?upgPracticeUuid=${this.upgPracticeUuid}&date=${item.date}&practiceType=${this.practiceType}&levelUuid=${item.levelUuid}`,
      })
    },
    // 获取成绩统计 - 每日一练
    pageUpgPracticeDate() {
      pageUpgPracticeDate({ upgPracticeUuid: this.upgPracticeUuid, pageNo: this.pageNo, pageSize: 10 }).then(res => {
        this.dailyTableData.list = this.pageNo === 1 ? [...res.datas] : [...this.dailyTableData.list, ...res.datas]
        this.pageTotal = res.totalPage
      })
    },
    // 获取成绩统计 - 知识竞赛
    pageJsPracticeCountLevel() {
      pageJsPracticeCountLevel({ upgPracticeUuid: this.upgPracticeUuid, pageNo: this.pageNo, pageSize: 10 }).then(res => {
        this.rivalryTableData.list = this.pageNo === 1 ? [...res.datas] : [...this.rivalryTableData.list, ...res.datas]
        this.pageTotal = res.totalPage
      })
    },
    getList() {
      if (this.practiceType == '1') {
        this.pageUpgPracticeDate()
      } else if (this.practiceType == '3') {
        this.pageJsPracticeCountLevel()
      }
    },
    scrolltolower() {
      if (this.pageNo < this.pageTotal) {
        this.pageNo++;
        this.getList()
      }
    }
  },
  onLoad(options) {
    this.upgPracticeUuid = options.upgPracticeUuid
    this.practiceType = options.practiceType
    this.getList()
  }
}
</script>

<style scoped lang="scss">
.practiceStatistics {
  height: 100vh;
  width: 100vw;
  padding-bottom: calc(20px + env(safe-area-inset-bottom));

  .line {
    width: 100%;
    background-color: #F5F5F5;
  }

  .table {
    margin-top: 10px;
    background-color: #FFFFFF;
    padding-bottom: calc(10px + env(safe-area-inset-bottom));
  }
}
</style>